<template>
	<view class="tracks_wrapper">
		<view class="track_content">
			<view class="track_list">
				<view class="track_item" v-for="(item,index) in trackList" :key="index">
					<view class="track_item_header">{{item.datetime}}</view>
					<view class="track_article">
						<up-cell  @click="go(`/pages/zixun/details?id=${item2.consult_id}&title=${item2.consult_name}`)" v-for="(item2,index2) in item.list" class="art_cell" :title="item2.consult_name" :label="item2.consult_createtime">
							<template #icon>
							
								<image class="art_pic" :src="$BASE_URL+item2.image"></image>
							</template>
						</up-cell>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script setup>
		import {
			ref,
			unref,
			getCurrentInstance
		} from "vue"
		const {
			proxy
		} = getCurrentInstance()
		import {
			onLoad
		} from "@dcloudio/uni-app"
		const page = ref({
			page:1,
			limit:10
		});
		const userInfo = ref({});
		const count = ref(5);
		const value = ref(4);
		const trackList = ref([]);
	function getUserData() {
		proxy.$request({
			url: 'api/User/getBroConLists',
			header: "application/x-www-form-urlencoded",
			data: {
				page:page.value.page,
				limit:page.value.limit,
				// 1收藏  2浏览足迹
				type:2
			}
		}).then(res => {
			if (res.code == 0) {
				return proxy.$toast(res.msg)
			} else {
				if(res.data){
					trackList.value=[]
					for(var i in res.data){
						if(i!='count_num'){
							trackList.value.push({
								datetime:i,
								list:res.data[i]
							})
						}
					}
				}
	
			}
		})
	}
	getUserData()
	function handleSkip() {
		uni.navigateTo({
			url: '/pages/serve/detail'
		})
	}
</script>

<style lang="scss" scoped>
	.tracks_wrapper {
		background: #F8F8F8;

		.flex-between {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.track_content {

			.track_list {
				.track_item {
					padding: 0 32rpx;

					.track_item_header {
						height: 80rpx;
						background: #F8F8F8;
						line-height: 80rpx;
						color: #999;
						font-size: 24rpx;


					}

					.track_info {
						background: #fff;
						padding: 20rpx 0;

						.serve-master {
							position: relative;

							image {
								width: 100%;
								height: 304rpx;
							}

							.master-tit {
								position: absolute;
								left: 0;
								right: 0;
								width: 100%;
								text-align: center;
								top: 0;
								height: 304rpx;
								line-height: 304rpx;

							}

							text {
								font-size: 36rpx;
								font-weight: bold;
								color: #fff
							}

						}

						.serve-detail-info {
							padding: 20rpx;

							.detail-info-list {
								text {
									display: block;
									margin: 8rpx 0;
								}

								.detail-val {
									color: #333;
									font-size: 28rpx;
								}

								.detail-label {
									font-size: 26rpx;
									color: #999
								}
							}

						}

						.serve-other {
							font-size: 24rpx;
							margin-bottom: 24rpx;
							padding: 0 12rpx;
							// height: 32rpx;
							// line-height: 32rpx;

							.serve-other-star {
								display: flex;
								justify-content: flex-start;
								align-items: center;
								color: #333;

								image {
									position: relative;

									width: 32rpx;
									height: 32rpx;
									top: 6rpx;
									left: 6rpx;
									margin-left: 10rpx;
								}


							}

							.serve-other-link {
								color: #999;

								image {
									width: 28rpx;
									height: 28rpx;
									position: relative;
									top: 6rpx;
								}
							}
						}
					}

					.serve-biaoqian {
						.serve-tags {
							display: flex;
							justify-content: flex-start;
							align-items: center;
							margin: 20rpx 0;

							.tag-item {
								width: 152rpx;
								height: 60rpx;
								line-height: 60rpx;
								border-radius: 16rpx;
								text-align: center;
								color: #FF9839;
								background: #FFF6EE;
								font-size: 24rpx;
								margin-left: 12rpx;
							}
						}
					}

					.track_article {
						margin-top: 20rpx;
						background: #fff;

						.art_cell {
							margin-top: 20rpx;
						}

						.art_pic {
							width: 160rpx;
							height: 160rpx;
							border-radius: 16rpx;
							margin-right: 10rpx;
						}
					}
				}

			}
		}
	}
</style>